<template>
  <div style="height:100%">
    <cube-scroll
      ref="scroll"
      :data="data"
      :options="options"
      @pulling-down="onPullingDown"
      @pulling-up="onPullingUp"
      v-if="data.length > 0"
    >
      <!-- <van-cell-group>
        <van-cell
          value-class="countClass"
          title="献浆记录"
          :value="`+${item.allMoney}`"
          :label="item.shareDate"
          v-for="item in data"
        />
      </van-cell-group> -->

      <van-collapse v-model="activeNames">
        <van-collapse-item
          :value="`+${item.allMoney}`"
          value-class="countClass"
          v-for="(item,index) in data"
          :key="index"
        >
          <div slot="title">
            <div class="item-title">宣传记录</div>
            <div class="item-date">{{ item.shareDate }}</div>
          </div>
          <van-cell
            :title="detail.tyName"
            :value="`+${detail.money}`"
            value-class="detailClass"
            v-for="detail in item.detail"
          />
        </van-collapse-item>
      </van-collapse>
    </cube-scroll>
    <no-data v-else :img="require('./img/noData.png')" text="暂无献浆收益哦～" />
  </div>
</template>

<script>
import { incomeList } from "@/api/income";
import noData from "@/components/noData";

export default {
  data() {
    return {
      activeNames: [],
      data: [],
      queryParams: {
        type: 1,
        current: 1,
        size: 10
      },
      options: {
        pullDownRefresh: true,
        pullUpLoad: true
      }
    };
  },
  created() {
    this.getList().then(({ data }) => {
      this.data = data;
    });
  },
  methods: {
    getList() {
      return incomeList(this.queryParams);
    },
    onPullingDown() {
      console.log("下拉刷新");
      this.queryParams.current = 1;
      this.getList().then(({ data }) => {
        this.data = data;
      });
    },
    onPullingUp() {
      console.log("上拉加载");
      this.queryParams.current += 1;
      this.getList().then(({ data }) => {
        this.data = [...this.data, ...data];
        this.$refs.scroll.forceUpdate(false, true);
        // 已经没有更多页
        if (data.length <= 0) {
          this.options.pullUpLoad = false;
          this.$refs.scroll.refresh();
        }
      });
    }
  },
  components: {
    noData
  }
};
</script>

<style lang='scss'>
</style>
